<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="UTF-8">
	<title>登录页面</title>
	
	<script src="js/axios.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
	
	<link rel="stylesheet" type="text/css" href="css/util.css">
	<link rel="stylesheet" type="text/css" href="css/main.css">
	
	<style type="text/css">
		body{
			background-image: url(./img/bg-01.jpg);
			background-size: cover;
		}
	</style>
</head>

<body>

	<div id="app">
		<div class="container-login100" style="background-image: url('images/bg-01.jpg');">
			<div class="wrap-login100 p-l-55 p-r-55 p-t-65 p-b-54">
				<form class="login100-form validate-form">
					<span class="login100-form-title p-b-49">登录</span>

					<div class="wrap-input100 validate-input m-b-23" data-validate="请输入用户名">
						<span class="label-input100">用户名</span>
						<input v-model="user" class="input100" type="text" name="username" placeholder="请输入用户名" autocomplete="off">
						<span class="focus-input100" data-symbol="&#xf206;"></span>
					</div>

					<div class="wrap-input100 validate-input" data-validate="请输入密码">
						<span class="label-input100">密码</span>
						<input v-model="upwd" class="input100" type="password" name="pass" placeholder="请输入密码">
						<span class="focus-input100" data-symbol="&#xf190;"></span>
					</div>

					<div class="text-right p-t-8 p-b-31">
						<a href="javascript:">忘记密码？</a>
					</div>

					<div class="container-login100-form-btn">
						<div class="wrap-login100-form-btn">
							<div class="login100-form-bgbtn"></div>
							<button class="login100-form-btn" @click="login()">登 录</button>
						</div>
					</div>

					<div class="txt1 text-center p-t-54 p-b-20">
						<span>第三方登录</span>
					</div>

					<div class="flex-c-m">
						<a href="#" class="login100-social-item bg1">
							<i class="fa fa-wechat"></i>
						</a>

						<a href="#" class="login100-social-item bg2">
							<i class="fa fa-qq"></i>
						</a>

						<a href="#" class="login100-social-item bg3">
							<i class="fa fa-weibo"></i>
						</a>
					</div>

					<div class="flex-col-c p-t-25">
						<a href="javascript:" class="txt2" @click="ZhuCe()">立即注册</a>
					</div>
				</form>
			</div>
		</div>
	</div>
	
	<script type="text/javascript">
		let va=new Vue({
			el:"#app",
			data:{
				user:"",
				upwd:""
			},
			methods:{
				login(){
					var da=new URLSearchParams();
					da.append("user",this.user);
					da.append("upwd",this.upwd);
					
					axios.post("http://localhost:8088/CourseManage/LoginServlet",da)
					.then(res=>{
						console.log(res);
						if(res.data.admin=="OK" || res.data.stuuser=="OK"){
							if(res.data.admin=="OK"){
								location.href="AdminPage.html";
							}else{
								location.href="UserPage.html"
							}
						}else{
							alert("用户名或密码错误！！！")
						}
						
					})
					
				},
				
				ZhuCe(){
					location.href="ZhuCe.html";
				}
			}
		})
	</script>


</body>

</html>